import React, { useState } from "react";
import { Row, Col, Space } from "antd";
import { ClipboardText } from "@/pages/OrderModule/common/components/CommonText";
import { uniq } from "lodash";
import moment from 'moment';
import ShopIcons from "@/views/components/ShopIcons";

const BasicInformation = props => {
	const { item } = props;
	const orderSns = [...new Set(item.goodsList.map(good => good.outOrderSn) || [])];

	const renderRow = list => {
		return (
			<Row gutter={[10, 10]}>
				{list.map((item, index) => {
					return (
						<Col span={8} key={index}>
							{item}
						</Col>
					);
				})}
			</Row>
		);
	};

	const getLogisticInfo = (field) => {

		return uniq(item.logisticsList.map(item => item[field])).join(",");
	};

  const timeFormat = (time) => {
    return time?moment(time).format("YYYY-MM-DD HH:mm:ss"):time
  }

	return (
		<>
			{renderRow([
				<Space>
					系统订单号：
					<ClipboardText as="s2" text={item.sn} />
				</Space>,
				<Space>
					<div className="flex">
					 <span style={{width:'96px'}}>店铺订单号：</span>
					 <ClipboardText as="s2" text={orderSns.join(',') || ""} style={{wordBreak:'break-all'}}/>
					</div>
				</Space>,
				<Space>店铺： <ShopIcons type={item.orderChannel} />{item.ecStoreName}</Space>

			])}
			{renderRow([
				// <Space>平台应付金额： {item.ecReceivableAmount ? "¥" + item.ecReceivableAmount : 0}</Space>,
				// <Space>平台运费： {item.ecShippingAmount ? "¥" + item.ecShippingAmount : 0}</Space>,
				<Space>平台实付金额： {item.ecActualPayment ? "¥" + item.ecActualPayment : 0}</Space>,
				<Space>快递公司： {item.logisticsList[0]?.logisticsCompanyName}</Space>,
				<Space>快递单号：{getLogisticInfo("logisticsNo")}</Space>,
			])}
			<Space>买家账号：<span className="textOverflowMultiOne" style={{maxWidth: '1000px'}}>{item.buyerNickName}</span></Space>
			{renderRow([
				<Space>平台付款时间：{timeFormat(item.ecPayTime)}</Space>,
				<Space>订单审核时间：{timeFormat(item.checkTime)}</Space>,
				<Space>订单发货时间：{timeFormat(item.logisticsList[0]?.deliveryTime)}</Space>
			])}
		</>
	);
};

export default BasicInformation;
